<template>
  <div class="xtx-bread-item">
    <RouterLink v-if="to" :to="to"><slot /></RouterLink>
    <span v-else><slot /></span>
    <template v-if="separator">
        {{separator}}
    </template>
    <template v-else>
        <i class="iconfont icon-angle-right"></i>
    </template>

  </div>
</template>

<script>
import { inject } from 'vue'
export default {
  name: 'XtxBreadItem',
  props: {
    to: {
      type: String
    }
  },
  setup (props) {
    const separator = inject('separator')
    return {
      separator
    }
  }
}
</script>
